import React, { Component } from 'react'
import PropTypes  from "prop-types";
import "./index.css";
import Item from "../Item";

export default class List extends Component {
    // 对接收的props进行/类型/必要性的限制
    static propTypes = {
        todos:PropTypes.array.isRequired,
        updateTodo:PropTypes.func.isRequired,
        deleteTodo:PropTypes.func.isRequired
    }
    render() {
        const {todos,updateTodo,deleteTodo} = this.props
        return (
            <ul className='todo-main'>
                {
                    todos.map((item)=>{
                        // return <Item key={item.id} id={item.id} name={item.name} done={item.done}/>
                        return <Item key={item.id} {...item} updateTodo={updateTodo} deleteTodo={deleteTodo}/>
                    })
                }
            </ul>
        )
    }
}
